<template>
  <el-form label-width="120px" v-loading="isLoadingData">
    <el-form-item :label="x.comments" v-for="x in site_config_list">
      <el-input rows="20" type="textarea" v-model="x.value" />
    </el-form-item>
    <el-form-item>
      <el-button @click="saveSiteConfig" :loading="isLocking"
        >保存配置</el-button
      >
    </el-form-item>
  </el-form>
</template>
<script lang="ts">
import Method from '@/globalmethods.ts'
import { ElMessage } from 'element-plus'
import { siteConfig, siteSaveConfig } from '../type.ts'

export default {
  name: 'admin-motd',
  data() {
    return {
      page: 1,
      limit: 10,
      total: 0,
      isLoadingData: false,
      isLocking: false,
      isInjecting: false,
      isPassing: false,
      site_config_list: <siteConfig[]>[],
    }
  },
  methods: {
    /**
     * 配置列表刷新
     */
    refreshConfigList() {
      this.isLoadingData = true
      let payLoad = {
        page: this.page,
        limit: this.limit,
      }
      Method.api_post('/admin/get_site_config', payLoad).then((response) => {
        this.isLoadingData = false
        let res = response.data
        if (res.code == 200) {
          if (this.page == 1) this.total = res.sum
          this.site_config_list = res.data
        }
      })
    },
    saveSiteConfig() {
      this.isLocking = true
      let config = <siteSaveConfig[]>[]
      this.site_config_list.forEach((x: siteConfig) => {
        config.push({ id: x.id, value: x.value })
      })
      let payLoad = {
        config: JSON.stringify(config),
      }
      Method.api_post('/admin/save_site_config', payLoad).then((response) => {
        this.isLocking = false
        let res = response.data
        if (res.code == 200) {
          ElMessage('保存成功')
        } else ElMessage(res.msg)
      })
    },
  },
  mounted() {
    this.refreshConfigList()
  },
}
</script>
